layui.use('table', function () {
    var table = layui.table;

    table.render({
        elem: '#test'
        , url: 'http://localhost:8080/orderAll'
        , toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
        , title: '用户数据表'
        , cols: [[
            {type: 'checkbox', fixed: 'left'}
            , {field: 'orderId', title: '订单Id', width: 100,}
            , {field: 'orderNo', title: '订单编号', width: 100}
            , {field: 'orderDate', title: '订单日期', width: 90,templet:"<div>{{layui.util.toDateString(d.orderDate,'yyyy-MM-dd HH:mm:ss')}}</div>"}
            , {field: 'orderUserId', title: '用户Id', width: 100}
            , {field: 'orderGoodId', title: '商品Id', width: 90}
            , {field: 'orderMoney', title: '订单价格', width: 100}
            , {field: 'orderState', title: '订单状态', width: 110}
            , {field: 'orderCount', title: '数量', width: 80, sort: true}
            , {field: 'reserve3', title: '尺码', width: 80, sort: true}
            , {field: 'reserve2', title: '发货地址', width: 100}
            , {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 150}
        ]]
        , page: true
    });

    //头工具栏事件
    table.on('toolbar(test)', function (obj) {
        var checkStatus = table.checkStatus(obj.config.id);
        switch (obj.event) {
            case 'getCheckLength':
                var data = checkStatus.data;
                layer.msg('选中了：' + data.length + ' 个');
                break;
            case 'isAll':
                layer.msg(checkStatus.isAll ? '全选' : '未全选');
                break;
        }
        ;
    });

    //监听行工具事件
    table.on('tool(test)', function (obj) {
        var data = obj.data;
        //console.log(obj)
        if (obj.event === 'del') {
            layer.confirm('真的删除行么', function (index) {
                obj.del();
                dlevalue(obj.data.orderId)
                layer.close(index);
            });
        } else if (obj.event === 'edit') {
            let orderstate = inputvalue(obj.data.orderState)
            localStorage.setItem("orderState",orderstate)
            layer.alert(
                '<form class="layui-form layui-form-pane" action="">\n' +
                '    <div class="layui-form-item">\n' +
                '        <label class="layui-form-label">订单状态</label>\n' +
                '        <div class="layui-input-block">\n' +
                '            <input type="text" id="orderstate" name="orderstate" lay-verify="title" autocomplete="off" placeholder="请输入 已发货 或 未发货" class="layui-input">\n' +
                '        </div>\n' +
                '        <p id="orderstatecon" style="color: #b1191a"></p>\n' +
                '    </div>\n' +
                '</form>\n' +
                '<script>\n' +
                '    $("#orderstate").val(localStorage.getItem("orderState"))\n' +
                '</script>',
                {
                    title:'修改表单',
                    type: 0,
                    skin:'layui-layer-moly',
                    closeBtn:1,
                    anim:0,
                    shadeClose: true,
                    area:['400px','300px'],
                }, function () {
                    orderstatejudge($("[name='orderstate']").val())
                    $("#orderstate").blur(function () {
                        orderstatejudge($(this).val())
                    })
                    let orderId = obj.data.orderId
                    alliskey(orderId)
                }
            )
        }
    });
});

layui.laytpl.toDateString = function (d, format) {
    var date = new Date(d || new Date())
        , ymd = [
        this.digit(date.getFullYear(), 4)
        , this.digit(date.getMonth() + 1)
        , this.digit(date.getDate())
    ]
        , hms = [
        this.digit(date.getHours())
        , this.digit(date.getMinutes())
        , this.digit(date.getSeconds())
    ];

    format = format || 'yyyy-MM-dd HH:mm:ss';

    return format.replace(/yyyy/g, ymd[0])
        .replace(/MM/g, ymd[1])
        .replace(/dd/g, ymd[2])
        .replace(/HH/g, hms[0])
        .replace(/mm/g, hms[1])
        .replace(/ss/g, hms[2]);
};

function inputvalue(value) {
    if (value === null) {
        return  ""
    } else {
        return value
    }
}

function orderstatejudge(orderstateval) {
     if (orderstateval === "已发货" || orderstateval === "未发货"){
         $("#orderstatecon").html("")
         return true
     }else {
         $("#orderstatecon").html("输入错误或为空")
         return false
     }
}

function alliskey(orderId) {
    let orderstate = $("#orderstate").val()
    if (orderstatejudge(orderstate)){
        console.log(orderstate)
        $.ajax({
            url: "http://localhost:8080/updateOrder",
            data:"orderId=" + orderId + "&orderState=" + orderstate,
            dataType:"json",
            type:"get",
            success:function (data) {
                showResult(data)
            }
        })
    }
}


function dlevalue(deletId) {
    $.getJSON("http://localhost:8080/deleteOrder", "orderId=" + deletId, function (data) {
        console.log(data.code)
        showResult(data)
    })
}


function showResult(data) {
    if (data.code === 0) {
        layer.alert('<div style="height: 45px;text-align:center;line-height: 45px">操作成功</div>', {
            title: '提示',
            skin: 'layui-layer-lan'
            , closeBtn: 0
        }, function () {
            window.location.reload()
        })
    } else {
        layer.alert('<div style="height: 45px;text-align:center;line-height: 45px">操作失败</div>', {
            title: '提示',
            skin: 'layui-layer-lan'
            , closeBtn: 0
        })
    }
}

